$(document).ready(function () {
	reloadHools();
	$('#show_profile_button').click(showProfile);
	$('#show_delete_modal_button').click(showDeleteModal);
	$('#delete_button').click(deleteHooligan);
	$('#reload_button').click(reloadHools);
	$('#filter').keyup(function () {

		var filter = $('#filter').val().toLowerCase();
		console.log(filter);

		$('tr').show();
		if (filter.length == 0) return;

		$('tr:not(:first)').each(function () {
			console.log($(this).find(".name").text());
			if ($(this).find(".name").text().toLowerCase().indexOf(filter) == -1
			 && $(this).find(".lastname").text().toLowerCase().indexOf(filter) == -1) {

				$(this).hide();
			}
		});

	});
});

function showProfile() {
	if (typeof getSelectedId() === 'undefined') {
		alert("You must select row.");
		return;
	}
	window.location.href = "/hools/show/" + getSelectedId();
}

function getSelectedId() {
	return $('input[name=tab1]:checked').val()
}

function showAddModal() {
	resetForm();
	$('#submit_add').click(addHooligan);
	$('#hool_modal_title').html('Add Hooligan <button class="btn btn btn-warning" onclick="resetForm();">Reset</button>');
	$('#add_hool_modal').modal('show');
	$('progress').hide();
	$('#hool_modal_alert_area').html('');
}

function resetForm() {
	$(":input").not(":button, :submit,select, :reset, :hidden,.tabradio").each(function () {
		this.value = this.defaultValue;
	});
}

function reloadHools() {
	$.ajax({
		
		url: "/api/hools/get/all/",
		type: 'POST',
		data: {
			csrfmiddlewaretoken: $.cookie('csrftoken') // just the token value
		},
		success: function (response) {
			$('#hools_table_body').html('');
			var hooligan = eval(response);
			for (i = 0; i < hooligan.length; i++) {
				$('#hools_table_body').append('<tr>' + '<td><input class="tabradio" type="radio" name="tab1" value="' + hooligan[i].id + '" /></td><td>' + hooligan[i].id + '</td>' + '<td class="name">' + hooligan[i].name + '</td>' + '<td class="lastname">' + hooligan[i].lastname + '</td>' + '<td><a href=\'/api/hools/img/' + hooligan[i].photoUrl + '\'"> img</a>' + '</td>' + '<td>' + hooligan[i].date + '</td>' + '<td>' + hooligan[i].user + '</td>' + '</tr>');
			}
		}
	});
}

function deleteHooligan() {
	$.ajax({

		url: "/api/hools/delete/",
		type: 'POST',
		data: {
			csrfmiddlewaretoken: $.cookie('csrftoken'), // just the token value
			id: getSelectedId()
		},
		success: function (response) {
			$('#delete_modal').modal('hide');
			reloadHools();
		}
	});
}


function addHooligan() {
	$('progress').show();
	var formData = new FormData(document.getElementById('hooligan_form'));
	$.ajax({
		url: '/api/hools/create/',
		type: 'POST',
		xhr: function () {
			_xhr = $.ajaxSettings.xhr();
			if (_xhr.upload) {
				_xhr.upload.addEventListener('progress', progressHandlingFunction, false);
			}
			return _xhr;
		},
		success: createUserCompleteHandler,
		error: createUserErrorHandler,
		data: formData,
		cache: false,
		contentType: false,
		processData: false
	});
}

function progressHandlingFunction(e) {
	if (e.lengthComputable) {
		$('progress').attr({
			value: e.loaded,
			max: e.total
		});
	}
}

function createUserCompleteHandler(response) {
	var val = eval(response)[0].Error;
	if (val == 0) {
		showAlert('hool_modal_alert_area', 'success', 'Stworzono nowego chuligana!');
		resetForm();
		$('#add_hool_modal').modal('hide');
	} else showAlert('hool_modal_alert_area', 'error', 'Problem ze sworzeniem nowego chuligana!')
	$('progress').hide();
	reloadHools();
}



function createUserErrorHandler(result) {
	showAlert('hool_modal_alert_area', 'error', 'Problem ze sworzeniem nowego chuligana!')
	$('progress').hide();
}

function showAlert(where, type, message) {
	$('#' + where).html('');
	$('#' + where).append('<div class="alert alert-' + type + '">' + message + ' </div>');
}

function showDeleteModal() {
	$('#delete_modal').modal('show');
}